<div class="login" #loginContent>
  <form #form="ngForm" (ngSubmit)="form.form.valid && doLogin()" novalidate class="col-xs-12 col-sm-5 form-horizontal ">
    <div class="form-group" [ngClass]="{ 'has-error': form.submitted && !userName.valid }">
      <label class="col-xs-12 col-sm-4 control-label">用户名</label>
      <div class="col-xs-12 col-sm-8">
        <input type="text" class="form-control" required name="userName" [(ngModel)]="user.userName" #userName="ngModel">
        <div *ngIf="form.submitted && !userName.valid" class="text-danger">用户名必须输入！</div>
      </div>
    </div>
    <div class="form-group"  [ngClass]="{ 'has-error': form.submitted && !password.valid }">
      <label class="col-xs-12 col-sm-4 control-label">密码</label>
      <div class="col-xs-12 col-sm-8">
        <input type="password" class="form-control" required minlength="8" [(ngModel)]="user.password" name="password" #password="ngModel" >
        <div *ngIf="form.submitted && !password.valid" class="text-danger">密码必须输入,至少要8位！</div>
      </div>
    </div>
    <div *ngIf="error" class="col-sm-offset-4 col-sm-8 alert alert-danger">{{error}}</div>
    <div class="form-group">
      <div class="col-xs-12 col-sm-offset-4 col-sm-8">
        <button type="submit" class="btn btn-warning">登录</button>
      </div>
    </div>
  </form>
</div>
